<%@ page language="java" import="java.util.*" pageEncoding="UTF-8" %>
<% String path=request.getContextPath(); String basePath=request.getScheme()+ "://" + request.getServerName() + ":" + request.getServerPort() + path+ "/"; %>
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" >
<html  xmlns="http://www.w3.org/1999/xhtml"> 
<head>
<base href="<%=basePath%>">
<title>新增激活卡定义列表</title>
<%@ include file="/WEB-INF/jsp/common/common.jsp" %>
<script src="js/jquery.divbox.js" type="text/javascript"></script>
	<style>
		/* .scroll_box {
			width:100%;
			overflow: scroll;
		}
		.scroll_table {
			width: 150%;
		} */
		.input_button_1,
		.input_button_2{
			margin-right: 10px;
		}
		.h_30 {
			height: 30px;
			line-height: 30px;
		}
		.table_body_div {
			padding: 30px;
		}
		.table_body_title {
			font-weight: bold;
			font-size: 16px;
		}
		.fr {
			float: right;
		}
		.fl {
			float: left;
		}
		.depts {
			padding-top: 10px;
		}
		/* 清除浮动 */
		.depts::after {
			clear:both;
			content:'.';
			display:block;
			width: 0;
			height: 0;
			visibility:hidden;
		}/*==for FF/chrome/opera/IE8==*/
		.depts li {
			width: 25%;
			float: left;
			line-height: 30px;
			height: 30px;
		}
		.depts li input {
			margin-right: 5px;
		}
		#areaDiv {
			padding-bottom: 20px;
		}
	</style>
	<script type="text/javascript">
	/*----------- 初始化 ------------------- */
	function init() {
		queryCarTemplate('1')
	}
	$(function() {
		init()
	})
	/*----------- 初始化 ------------------- */
	/* -------------------查询模板------------------------------- */
	/* 查询卡模板 */
	function queryCarTemplate(displayPage){
		var id= $("#id").val();
		var name= $("#name").val();
		var isBegin= $("#isBegin").val();
		var startTime= $("#startTime").val();
		var endTime= $("#endTime").val();
		loadQueryData({current:displayPage,size:10,id: id, name: name, isBegin: isBegin, startTime: startTime, endTime: endTime});
	}
	function loadQueryData(param){
		var jsonDate;
		if(null != param && null != param.current){
			jsonDate =param;	
		}else{
			jsonDate={current:1,size:10};
		}
		$.openLoading();
		$.ajax({
			url : "actirationCard/queryList",
			type : 'POST',
			async : true,
			dataType:'json',
			data:jsonDate,
			success : function(page) {
				$.closeLoading();
				var radioObj ="<input class='input_fxk' name='radioCard' type='radio' value=''>";
				var lastColumnFunction = function (val) {
					if (val.isBegin == '1') {
						return '<input type="button" class="input_button_1" id="areaBtn" value="停用" onClick="cardStop(this)" />';
					} else if (val.isBegin == '0') {
						return '<input type="button" class="input_button_1" id="areaBtn" value="启用" onClick="cardBegin(this)" />';
					} else {
						return '';
					}
				}
				var fieldNames = "name,id,benefitTerm,unitPp@TDH,modalPremamtPp,selectDeptno@TDH,planNo,isPublic?{'Y': '是'; 'N': '否'},id@TDH,empno@TDH,isBegin?{'1': '启用'; '0': '停用'}";
				var tableContent = creatTable4(fieldNames, page, radioObj, lastColumnFunction);
				var tableObj = $("#gatewayproductTable");
				tableObj.find("tbody").remove();
				tableObj.append(tableContent);
				
				var strPage = creatChannelPage(page.current,6,page.maxPage,"72");
				var pageDIV = $("#txproductpageDIV");
				pageDIV[0].innerHTML="";
				pageDIV.append(strPage);
				bindradio();//点击单选按钮，该行高亮显示
			}
		})
	}
	/* 新增卡模板 */
	function insertCardTemplate() {
		self.location.href="<%=path%>/actirationCard/difinitionAdd";
	}
	/* 查询申请卡模板 */
    function checkCardTemplate() {
		if ($('.table_highlighter').length < 1) {
			$.message("error", "请选择一个激活卡！")
		}
		else {
			var cVocherType = $('.table_highlighter').children()[7].innerHTML
			if(cVocherType!=""){
				var id = $('.table_highlighter').children()[2].innerHTML
		    	self.location.href="<%=path%>/actirationCard/difinitionAdd?id="+id;	
			}else{
				$.message("error", "请选择出单方案不为空的激活卡！")
			}
		}
    }
	/* 单选高亮 */
    function bindradio(){
		$("input[name='radioCard']").click(function(){
			$("input[name='radioCard']").parent().parent().removeClass("table_highlighter");
			$(this).parent().parent().addClass("table_highlighter");
	   	});
    }
	/* -----------------------查询模板-------------------------- */
    /* ---------删除模板---------- */
    function del() {
    	if ($('.table_highlighter').length < 1) {
			$.message("error", "请选择一个激活卡！")
		} else {
			var id = $('.table_highlighter').children()[2].innerHTML
			delCard({templatid: id})
		}
	}
    function delCard(param) {
    	$.openLoading();
		$.ajax({
			url : "actirationCard/delete",
			type : 'POST',
			async : true,
			dataType:'json',
			data: param,
			success : function(data) {
				$.closeLoading();
				if("success"==data.result&&""!=data.message){
					$.message("success", data.message);
					queryCarTemplate('1')
		    	}
				if("fail"==data.result){
		    		$.message("error", "系统错误,请联系管理员");
		    	}
				if("error"==data.result&&""!=data.message){
		    		$.message("error", data.message);
		    	}
			}
		})
	}
    /* ---------删除模板---------- */
    /* -----------关联区域-------------- */
    //打开关联区域窗口 查询所有分公司
    function openAreaDiv() {
    	if($(".table_highlighter").length === 0) {
    		$.message("error", "请选中一条卡定义记录！");
    		return false
    	}
    	$("#nameSpan").html($(".table_highlighter").children()[1].innerHTML)
    	$.openLoading();
    	$.ajax({
    		url : "actirationCard/querycomcode",
        	type : 'POST',
        	async : true,
        	dataType:'json',
        	success:function(data){
    			$.closeLoading();
    			if(data.length < 1)return;
    			var containerBox = $("#areaDiv")
    			var dept = $(".depts")
    			$(".depts").html($.map(data, function (v, i) {
    				return '<li> <label> <input type="checkbox" name="areas" value="'+ v.deptCode +'" />' + v.deptCname + '</label></li>'
    			}).join(""))
    			toggleAll()
    			containerBox.OpenDiv()
    			checkAreaData()
        	}
    	});
    }
  	//打开关联区域窗口 查询所有分公司
    function checkAreaData() {
    	var cardDefineId = $(".table_highlighter").children()[2].innerHTML
    	$.openLoading();
    	$.ajax({
    		url : "actirationCard/querybind",
        	type : 'POST',
        	async : true,
        	dataType:'json',
        	data: {cardDefineId: cardDefineId},
        	success:function(data){
    			$.closeLoading();
    			$.each(data, function (i, v) {
    				$("input[name='areas'][value='"+ v.deptNo +"']").prop("checked",true);
    			})
    			checkALL()// 判断是否全选
    			ifCheckAll()
        	}
    	});
    }
    function addArea() {
    	// 获取所有机构号
    	var sales = $.map($("input[name='areas']"), function (v, i) {
    		if (v.checked) return v.value
    	})
    	var id = $(".table_highlighter").children()[2].innerHTML
    	if (sales.length < 1) {
    		$.message("error", "请至少选择一个销售区域！");
    		return
    	}
    	var params = {salesId: id, salesList: sales}
    	$.openLoading();
    	$.ajax({
    		url : "actirationCard/binding",
        	type : 'POST',
        	async : true,
        	dataType:'json',
        	data: params,
        	traditional :true,  //注意这个参数是必须的
        	success:function(data){
        		$.closeLoading();
        		if("success"==data.result&&""!=data.message){
    				$.message("success", data.message);
    				closeAreaDIV()// 关闭窗口
    				// location.reload()
    				queryCarTemplate($('.page_a_click').html())
    	    	}
    			if("fail"==data.result){
    	    		$.message("error", "系统错误,请联系管理员");
    	    	}
    			if("error"==data.result&&""!=data.message){
    	    		$.message("error", data.message);
    	    	}
        	}
    	})
    }
    // 关闭窗口 start
    function closeAreaDIV() {
    	closeCurrentDIV('areaDiv')
		$("input[name='checkAll']").prop("checked",false)
    }
    // 关闭窗口 end
    // 是否全选
    function ifCheckAll () {
    	// 点击分公司 全选 非全选
        $("input[name='areas']").parent().click(checkALL)
    }
    function checkALL() {
    	var flag = true
    	$.each($("input[name='areas']"), function (i, v) {
    		if (!v.checked) {
    			flag = !flag
    			return false
    		}
    	})
    	if (flag){
    		$("input[name='checkAll']").prop("checked",true)
    	} else {
    		$("input[name='checkAll']").prop("checked",false)
    	}
    }
    // 全选 全不选
    function toggleAll() {
    	// 点击全选按钮 全选或者全不选
        $("input[name='checkAll']").click(function() {
        	if ($("input[name='checkAll']").is(':checked')) {
        		$.each($("input[name='areas']"), function (i, v) {
        			$(v).prop("checked",true)
            	})
        	} else {
        		$.each($("input[name='areas']"), function (i, v) {
        			$(v).prop("checked",false)
            	})
        	}
        })
    }
    /* -----------关联区域-------------- */
    // -----------------------激活卡启用停用----------------
    // 激活卡启用
    function cardBegin(obj) {
    	var id = $(obj).parent().parent().children()[2].innerHTML
    	cardOnoff({templatid: id, onoffflag: '1'}, obj)
    }
    function cardStop(obj) {
    	var id = $(obj).parent().parent().children()[2].innerHTML
    	cardOnoff({templatid: id, onoffflag: '0'}, obj)
    }
    function cardOnoff(params, obj) {
    	$.openLoading();
    	$.ajax({
    		url : "actirationCard/onoff",
        	type : 'POST',
        	async : true,
        	dataType:'json',
        	data: params,
        	traditional :true,  //注意这个参数是必须的
        	success:function(data){
        		$.closeLoading();
        		if("success"==data.result&&""!=data.message){
    				$.message("success", data.message);
    				if (params.onoffflag == '1') {
    					$(obj).parent().parent().children()[11].innerHTML = '启用'
    					$(obj).parent().html('<input type="button" class="input_button_1" id="areaBtn" value="停用" onClick="cardStop(this)" />')
    				} else if (params.onoffflag == '0') {
    					$(obj).parent().parent().children()[11].innerHTML = '停用'
    					$(obj).parent().html('<input type="button" class="input_button_1" id="areaBtn" value="启用" onClick="cardBegin(this)" />')
    				}
    	    	}
    			if("fail"==data.result){
    	    		$.message("error", "系统错误,请联系管理员");
    	    	}
    			if("error"==data.result&&""!=data.message){
    	    		$.message("error", data.message);
    	    	}
        	}
    	})
    }
    // -----------------------激活卡启用停用----------------
    //统一 关闭  窗口
	function closeCurrentDIV(obj){
		$("#"+obj).CloseDiv();
	}
    // 重置查询条件 lfd added 20181009
	function resetSearch() {
		$('#name').val('')
		$('#id').val('')
		$('#startTime').val('')
		$('#endTime').val('')
		$('#isBegin option:selected').attr("selected", false)
	}
	</script>
</head>
<body >
	<div class="current">
		<table class="current_table_1">
			<tbody>
				<tr class="f2">
		            <td>
		              <img src="./images/current_1.jpg">
		            </td>
		            <td class="current_table_1_td">
		              <img src="images/current_1.png">&nbsp;您现在的位置：&nbsp;
		                <span style=" color:#136bab; ">激活卡管理
		                	<span style="padding:0 5px; font-weight:bold; line-height:28px;">&gt;</span>
		                	新增激活卡
		            	</span>
		            </td>
		            <td><img src="./images/current_3.jpg"></td>
	        	</tr>
			</tbody>
		</table>
	</div>			
		
	<table class="table_02" id="table">
		<tr>
			<td>
				<table class="search_table">
					<tr class="h_30">
						<td width="20%" class="h_30">卡定义名称：
							<input name="name" id="name" type="text" class="input_text" maxlength="30" value="">
						</td>
						<td width="20%" class="h_30">卡定义号：
							<input name="id" id="id" type="text" class="input_text" maxlength="30" value="">
						</td>
						<td width="20%" class="h_30">定义时间：
							<input id="startTime" onkeydown="false" onclick="showCalendar('startTime','y-mm-dd');" readonly="readonly" class="input_time" type="text" />
						</td>
						<td width="20%" class="h_30">至：
							 <input id="endTime" onkeydown="false" onclick="showCalendar('endTime','y-mm-dd');" readonly="readonly" class="input_time" type="text" />
						</td>
						<td width="20%" class="h_30">是否启用：
						 	<select class="search_select_1" id="isBegin">
								<option value="">--请选择--</option>
								<option value="1">启用</option>
								<option value="0">停用</option>
							</select>
						</td>
					</tr>
					<tr height="30px">
						<td height="30px"  colspan="4" style="text-align: center;">
							<input type="button" class="input_button_1" id="searchBtn" value="查询" onClick="queryCarTemplate(1)" />
						    <!-- 重置查询条件 lfd added 20181009 -->
						    <input type="button" class="input_button_1" id="resetBtn" value="重置" onClick="resetSearch()" />
						</td>
					</tr>
				</table>
			</td>
		</tr>
		<tr>
			<td>
				<table class="search_table">
					<tr class="h_30">
						<td class="h_30">
						    <input type="button" class="input_button_1" id="insertBtn" value="新增" onClick="insertCardTemplate()" />
							<input type="button" class="input_button_1" id="" value="编辑" onClick="checkCardTemplate()" />
							<input type="button" class="input_button_1" id="" value="删除" onClick="del()" />
							<input type="button" class="input_button_2" id="" value="关联区域" onClick="openAreaDiv(1,this)" />
						</td>
					</tr>
				</table>
			</td>
		</tr>
		<tr>
			<td>
				<div>
					<table id="gatewayproductTable" class="content_table_1">
						<thead>
							<tr class="f1">
								<th style="width:5%;">选择</th>
								<th style="width:27%;">卡定义名称</th>
								<th style="width:5%;">卡定义号</th>
								<th style="width:9%;">有效期限（月）</th>
								<th style="width:9%;">卡单保费（元）</th>
								<th style="width:9%;">出单方案</th>
								<th style="width:8%;">是否全国通用</th>
								<!-- <th style="width:10%;">卡定义时间</th>
								<th style="width:10%;">卡定义人</th> -->
								<th style="width:6%;">启用/停用</th>
								<th style="width:6%;">操作</th>
							</tr>
						</thead>
						<tbody>
						</tbody>
					</table>
				</div>
				
				<div id="txproductpageDIV" class="page"></div>
			</td>
		</tr>
	</table>
	<div id="Loading" style="display:none" align="center">
		<img src="./images/loading.gif" />
	</div>
	<!--   	销售区域 DIV 默认隐藏-->
	<div id="areaDiv"  style="display:none;width:80%;">
		<input type="hidden" id="row_num" name="row_num" value="0"/>
		<div class="table_title_div">
			<table class="table_title" style='width:100%;height:20px;'>
				<tr>
				<td width="10%"></td>
				<td width="80%" id="interfaceName"></td>
				<td width="10%" align="right"><img src="./images/closedown.gif" alt="关闭"  onclick="closeAreaDIV()"/></td>
				</tr>
			</table>
		</div>
		<div class="table_body_div">
			<div class="h_30 table_body_title">卡定义名称： <span id="nameSpan"></span></div>
			<div class="h_30"><span class="fl">销售区域列表</span> <label id="allSelect" class="fr"> <input type="checkbox" value="" name="checkAll"/> 全选</label></div>
			<ul class="depts"></ul>
		</div>
		<div align="center" >
		 	<input class="input_button_3" name="" type="button" onclick="addArea()" value="确定">&nbsp;&nbsp;
	        <input class="input_button_3" name="" type="button" onclick="closeAreaDIV()" value="取消">
		</div>
	</div>
	
</body>
</html>